<template>
    <a-drawer title="比价" :visible="dataVisible" width="60%" class="gt-drawer" unmount-on-close :ok-loading="loading"  @cancel="close" @ok="ok">
        <a-card title="地址信息">
            <a-space direction="vertical" size="large" fill>
                <a-descriptions :data="data" title="" layout="inline-horizontal" />
            </a-space>
            
        </a-card>
        <a-card title="">
        <a-table :columns="columns" :data="priceList" :pagination="false" :loading="loading">
            <template #columns>
                <a-table-column title="承运商"  data-index="name"></a-table-column>
                <a-table-column title="选择">
                    <a-table-column title="普" data-index="p" :width="200">
                        <template #cell="{ record }">
                            <span v-if="record.price_normal <=0">{{record.normal.msg}}</span>
                            <span style="margin-right: 10px" v-if="record.price_normal > 0">{{ record.price_normal }}</span>
                            <input  v-if="record.price_normal > 0" v-model="p_check" :value="record.code" type="radio" />
                            <a-tag color="green" v-if="record.check.includes(1) && record.price_normal > 0">荐</a-tag>
                        </template>
                    </a-table-column>
                    <a-table-column title="大" data-index="d" :width="200">
                        <template #cell="{ record }">
                            <span v-if="record.price_big <=0">{{record.big.msg}}</span>
                            <span style="margin-right: 10px" v-if="record.price_big > 0">{{ record.price_big }}</span>
                            <input  v-if="record.price_big > 0" v-model="d_check" :value="record.code" type="radio" />
                            <a-tag color="green" v-if="record.check.includes(2) && record.price_big > 0">荐</a-tag>
                        </template>
                    </a-table-column>
                    <a-table-column title="超" data-index="c" :width="200">
                        <template #cell="{ record }">
                            <span v-if="record.price_supper <=0">{{record.supper.msg}}</span>
                            <span style="margin-right: 10px" v-if="record.price_supper > 0">{{ record.price_supper }}</span>
                            <input  v-if="record.price_supper > 0" v-model="s_check" :value="record.code" type="radio" />
                            <a-tag color="green" v-if="record.check.includes(3) && record.price_supper > 0">荐</a-tag>
                        </template>
                    </a-table-column>
                </a-table-column>
            </template>
        </a-table>
    </a-card>
    </a-drawer>
</template>
<script setup>
import {computed, inject, provide, ref, watch} from "vue";
import sendOrder from "@/api/document/sendOrder.js";
import {Message} from "@arco-design/web-vue";
const getParcels = inject('getParcels')
const crudRef = inject('crudRef')
const dataVisible = ref(false)
const data = ref([])
const priceList = ref([])
const p_check = ref(0)
const d_check = ref(0)
const s_check = ref(0)
const loading = ref(true)
const record = ref({})
const parcelList = ref([])
const sendType = ref('1')
const columns = ref([
    {
        title: '名称',
        dataIndex: 'name',
        key: 'name',
    },
    {
        title: '价格',dataIndex: 'price',key: 'price',
    },
    {
        title: '普',key: 'p',
    },
    {
        title: '大',key: 'd',
    },
    {
        title: '超',key: 'c',
    },
])
const close = () => {
    dataVisible.value = false
}

const onShow = async (parcel,rec,send_type) => {
    record.value = rec
    data.value = [
        {label:'收件人',value:record.value.name},
        {label:'联系电话',value:record.value.phone},
        {label:'公司',value:record.value.company},
        {label:'联系邮箱',value:record.value.email},
        {label:'地址一',value:record.value.address1},
        {label:'备注',value:record.value.remark},
    ]  
  dataVisible.value = true
  parcelList.value = parcel
  sendType.value = send_type
  await getPriceList()
}

const getPriceList = async () => {
    loading.value = true
    let res = await sendOrder.InquiryPrice({shipment_id:record.value.id,parcel:parcelList.value,send_type:sendType.value},30000)
    if(res.success)
    {
        priceList.value = res.data
    }else{
        Message.error(res.message)
    }
    loading.value = false
}

const ok = async () =>{
    if(loading.value == true){
        return;
    }
    loading.value = true
    if(p_check.value){
        await saveOrder(parcelList.value.p,p_check.value,'普通货箱')
    }
    if(d_check.value){
        await saveOrder(parcelList.value.d,d_check.value,'大货箱')
    }
    if(s_check.value){
        await saveOrder(parcelList.value.c,s_check.value,'超尺寸货箱')
    }
    if(!p_check.value && !d_check.value && !s_check.value){
        Message.error('请选择一个价格')
        loading.value = false
        return;
    }
    setTimeout(() => {
        p_check.value = 0
        d_check.value = 0
        s_check.value = 0
        loading.value = false
        getParcels()
        crudRef.value.refresh()
        close()
    }, 2000);
}

const saveOrder = async (parcel,service,msg)=>{
    let res = await sendOrder.order({
    shipment_id:record.value.id,parcel:parcel,serviceType:service,remark:msg},30000)
    if(res.data.code == 200){
        Message.success(msg+res.data.message)
    }else{
        Message.error(res.data.message)
    }
    return false;
}

provide('getPriceList',getPriceList)
provide('onShow',onShow)

defineExpose({onShow})
</script>
